<template>
	<view class="container">

		<view class="cu-bar search">
			<view class="search-form round" style="background-color: #fff;margin: 0;">
				<text class="cuIcon-search"></text>
				<input @input="InputFocus" v-model="searchName" :adjust-position="false" type="text"
					placeholder="搜索项目名称" confirm-type="search" />
			</view>
			<!-- <view class="action">
					<button class="cu-btn bg-green shadow-blur round" @tap="searchList">搜索</button>
				</view> -->
		</view>

		<!-- 新闻列表 -->
		<view class="news-list">
			<view class="news-item" v-for="item in teamList" :key="item.id"
				@click="this.$openrul(`/pages/teamDetail/teamDetail?id=${item.id}`)">
				<view class="news-item__content">
					<view class="news-item__content__title">
						{{ item.name }}
					</view>
					<view class="">
						<!-- <rich-text class="news-item__content__desc" :nodes="item.detail"></rich-text> -->
						<text class="news-item__content__desc">{{ item.info }}</text>
					</view>
					<!-- <view >{{ item.detail }}</view> -->
					<!-- 时间 -->
					<view class="" style="display: flex;align-items: center;">
						<view class="news-item__content__time">{{ item.createtime }}</view>
						<view class="news-item__content__author">
							<view class="sm cu-avatar round"
								:style="{'background-image':`url(${domainPrefix + item.teacher.avatar})`}"></view>
							<view class="autname">
								{{ item.teacher.nickname }}
							</view>
						</view>
					</view>

				</view>

				<view class="news-item__image">
					<image :src="domainPrefix + item.image" mode="aspectFill"></image>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import loginjs from '../../core/login'
	export default {
		data() {
			return {
				searchName: '',
				domainPrefix: '',
				teamList: [],
				hasMore: true,
				teamListForm: {
					page: 1,
					limit: 10
				},
				news: [

				]
			}
		},
		// components:{

		// },
		  onShow(){
		    this.islogin()
		
		},
		onLoad(query) {
			// let token = JSON.parse(uni.getStorageSync('vuexvuex'))
			// var parsedData = JSON.parse(token.value);
			// var tokenValue = parsedData.userinfo.token; 
			let domainPrefix = this.$myHttp.config.baseUrl;
			this.domainPrefix = domainPrefix.replace(/\/$/, '');

			this.getTeamTaskList()

		},
		onReachBottom() {
			this.loadMoreTeamTaskList();
		},
		
		methods: {
			async loadMoreTeamTaskList() {
				
				console.log('%c [  ]-92', 'font-size:13px; background:pink; color:#bf2c9f;', 321)
				if (!this.hasMore) return uni.showToast({title: '没有更多了',icon: 'none',});
				this.teamListForm.page += 1;
				let res = await this.$myHttp.post({
					url: this.$myHttp.urlMap.teamtaskList,
					data: {
						page: this.teamListForm.page,
						limit: this.teamListForm.limit
					}
				})
				if (res.data.data.length < this.teamListForm.limit) {
					this.hasMore = false;
					// 提示没有更多了
					

				}
				this.teamList = this.teamList.concat(res.data.data)
			},
			   islogin() {
			
			      if (loginjs.checkIfLogin() == false) {
			        this.loginFlag = false
			        // 弹窗提示请登录后操作
			        uni.showToast({
			          title: '请先登录',
			          icon: 'none',
			          mask: true,
			          duration: 1000,
			        })
			
			        uni.navigateTo({
			          url: '/pages/auth/login/index'
			
			        })
			
			      }
			},
			InputFocus(e) {
				clearTimeout(this.timer);
				// 清除之前的定时器
				// 创建一个新的定时器
				this.timer = setTimeout(() => {
					this.searchList(e.detail.value)
				}, 500); // 设置防抖延迟时间为500毫秒
			},
			// 当搜索框内为空时重新请求列表
			async InputBlur(e) {
				console.log('e: ', e)
				this.InputBottom = 0
				if (e.detail.value == '') {
					let res = await this.$myHttp.post({
						url: this.$myHttp.urlMap.getProjectList,
						data: {
							name: this.searchName,
							isHis: false,
							page: 1,
							limit: this.limit,
						}
					})
			
					this.projectList = res.data.data
			
				}
			
			},
			async searchList(keyword) {
			


				// this.InputBottom = 0
				if (this.searchName !== '') {
					let res = await this.$myHttp.post({
						url: this.$myHttp.urlMap.teamtaskList,
						data: {
							name: this.searchName,
							page: 1,
							limit: 1000,
						}
					})
			
					this.teamList = res.data.data
					console.log('searchAfter,this.projectList: ', this.projectList)
			
					// this.projectListTotal = res.data.total
				} else {
					this.getTeamTaskList()
				}
			
			
				// 使用 Set 来存储已经存在的数据
				// let existingData = new Set(this.projectList.map(item => item.id));
			
				// 过滤掉已经存在的数据
				// let newData = res.data.data.filter(item => !existingData.has(item.id));
			
				// 将新数据添加到项目列表中
				// this.projectList = this.projectList.concat(newData);
			
			
			},
			async getTeamTaskList() {
				let res = await this.$myHttp.post({

					url: this.$myHttp.urlMap.teamtaskList,
					data: {
						page: this.teamListForm.page,
						limit: this.teamListForm.limit
					}
				})

				this.teamList = res.data.data
				console.log('res: ', res)
			},
			gotoTeamDetail() {
				uni.navigateTo({
					url: '/pages/teamDetail/teamDetail'
				})
			}
		}
	}
</script>

<style>
	.container {
		padding: 10px;
		background-color: #f5f5f5;
	}

	.news-list {
		overflow: hidden;
		display: flex;
		flex-direction: column;
		gap: 12px;
	}

	.news-item {
		border-radius: 5px;
		width: 100%;
		height: 110px;
		background-color: #fff;
		border-bottom: 1px solid #eee;
	}

	.news-item__content {
		position: relative;
		box-sizing: border-box;
		padding: 8px;
		width: 70%;
		height: 100%;
		float: left;
	}

	.news-item__content__title {
		padding-bottom: 4px;
		font-size: 18px;
		font-weight: 800;
		/* line-height: 100px; */
		display: -webkit-box;
		overflow: hidden;
		text-overflow: ellipsis;
		word-wrap: break-word;
		white-space: normal !important;
		-webkit-line-clamp: 1;
		-webkit-box-orient: vertical;
	}

	.news-item__content__desc {
		font-size: 12px;
		line-height: 16px;

		/* line-height: 100px; */
		/* 副标题超过两行显示省略号 */
		display: -webkit-box;
		overflow: hidden;
		text-overflow: ellipsis;
		word-wrap: break-word;
		white-space: normal !important;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
	}

	.news-item__content__time {
		position: absolute;
		left: 10px;
		bottom: 14px;
		color: #999;
		font-size: 12px;

	}


	.news-item__content__author {
		position: absolute;
		right: -16px;
		bottom: 5px;
		color: #999;
		font-size: 12px;
		width: 50%;
		display: flex;
		flex-direction: row;
		line-height: 27px;
		gap: 8px;

	}


	.news-item__content__author .tx {
		width: 27px;
		height: 27px;
	}

	.news-item__content__author .autname {
		display: -webkit-box;
		overflow: hidden;
		text-overflow: ellipsis;
		margin-top: 6rpx;
		word-wrap: break-word;
		white-space: normal !important;
		-webkit-line-clamp: 1;
		-webkit-box-orient: vertical;
	}

	.news-item__image {
		box-sizing: border-box;
		padding: 10px;
		width: 30%;
		height: 100%;
		float: left;
	}

	.news-item__image image {
		width: 100%;
		height: 100%;
	}
</style>